<template>
    <div class="address">
        <van-nav-bar
        class="nav-bar"
      title="编辑收获地址"
      left-text="管理地址"
      @click-left="add()"
    />
    <van-address-edit
  ref="addrs"
  :area-list="areaList"
  :address-info="addrinfo"
  show-delete
  show-set-default
  :area-columns-placeholder="[areaList.province_list.province_list, areaList.city_list.city_list, areaList.county_list.county_list]"
  @save="onSave"
  @delete="onDelete"
  @change-default="check"
/>
    </div>
</template>
<script>
import {areaList} from "@/utils/area";
import { Toast } from 'vant';
import {set,get,clear} from "@/utils/local"
// import {useCascaderAreaData} from "@/utils/area";
export default {
    components: {//注册组件
        
    },
    props: {},
    data() {
        return {
            areaList,//区域列表
            addrinfo:{},// 收货人初始信息 回显
        };
    },
    computed: {
        
    },
    created() {//创建
        
    },
    mounted() {//挂载
        // console.log(areaList);
        this.review()
    },
    methods: {//方法
      onSave(data){//保存地址
        const addr=get("addr")||[]
        if(data.id){
          addr.map((v,k)=>{
                if(v.id==data.id){// 找到id相等
                   addr[k]=data
                }
              })
            }else{// 新增的 要给id
            data.id=new Date().getTime()+''
            addr.push(data)
            }
            set("addr",addr)
            Toast('保存成功');
      },
      onDelete(data){
        
       if(data.id){
        this.addrinfo={}
       const delarr=get("addr")
       console.log(delarr);
       delarr.map((v,k)=>{
           if(v.id==data.id){
              delarr.splice(k,1)
              set("addr",delarr)
              Toast('删除成功');
           
       }
      })
       }else{
        Toast('请填写地址');
       }
      },
      review(){//地址回显
        const addr=get("addr")
            if(addr){
                // this.addrinfo=addr[0]
                this.addrinfo=addr.find(v=>v.id==this.$route.query.id)
                
            }
      },
      add(){//添加收货地址 
        this.$router.replace("/addrlist")
      },
      check(v){//设置默认
        const addrs=get("addr")
        addrs.map((m,n)=>{
          m.isDefault=false
      })
        v=!v
      set("addr",addrs)
      },

    },
    watch: {
        
    },
};
</script>
<style scoped lang="less">
.nav-bar {
    background: rgb(150, 191, 183)
}
.nav-bar /deep/ .van-nav-bar__left .van-nav-bar__text  {
  color: rgb(68, 70, 64);
  
}
.nav-bar /deep/ .van-icon-arrow-left{
  color: rgb(113, 118, 101);
}
.address /deep/ .van-switch--on{
    background: rgb(150, 191, 183);

}
.address /deep/ .van-button--danger {
    background: rgb(150, 191, 183);
    border: 1px solid rgb(150, 191, 183);
    
}
</style>
